<template>
  <view class="u-page">
    <u-cell icon="man-add" :title="title"></u-cell>
    <view style="height: 8px" />
    <u-grid :border="false" col="4" @click="onButtonClick">
      <u-grid-item v-for="(item, inx) in menus" :key="inx">
        <u-icon :customStyle="iconStyle(inx)" :name="item.name" :size="28"></u-icon>
        <view style="height: 2px" />
        <text class="grid-text">{{ item.title }} </text>
      </u-grid-item>
    </u-grid>
    <view style="height: 18px" />
    <u-cell icon="list-dot" title="已发布职位"></u-cell>
    <u-list @scrolltolower="scrolltolower">
      <u-list-item v-for="(item, index) in datalist" :key="index">
        <Detail :item="item" @onclickItem="showDetail"
          ><view slot="sn">{{ index + 1 }}</view></Detail
        >
        <u-gap height="1" bgColor="#E6E6E6"></u-gap>
      </u-list-item>
    </u-list>

    <!-- <u-button type="primary" @click="reqTest" text="test request"></u-button> -->
  </view>
</template>

<script>
const log = console.log.bind(console)
var Apis = {
  getWorkList: '/Open/Work/GetWorkList',
}
import detail from '../worker/detail.vue'
export default {
  components: {
    Detail: detail,
  },
  data() {
    return {
      datalist: [],
      title: '人才济济，用工不愁！',
      menus: [
        {
          action: 'addWork',
          name: 'plus-circle',
          title: '新增职位',
          bgcolor: '#007aff',
        },
        {
          action: 'applyRecord',
          name: 'order',
          title: '录用记录',
        },
        {
          action: 'sessage',
          name: 'kefu-ermai',
          title: '平台回复',
        },
        {
          action: 'other',
          name: 'more-circle',
          title: '其它',
        },
      ],
    }
  },
  computed: {},
  onLoad() {
    this.getList()
  },
  methods: {
    onButtonClick(buttonInx) {
      ;({
        addWork: () => {
          this.$open('/subPackages/work/addwork/index')
        },
        applyRecord: () => {
          this.$open('/subPackages/work/applyrecord/index')
        },
      }[this.menus[buttonInx].action]())
    },
    getList(p = 1, l = 10) {
      this.$http
        .get(Apis.getWorkList, {
          params: { page: p, limit: l },
        })
        .then((res) => {
          this.datalist = res.List
        })
        .catch((err) => {
          this.guestContent = '请求失败没有内容返回'
        })
    },

    reqTest() {
      this.$http
        .post('/api/Login/Index', { username: '1001', password: '123' })
        .then((res) => {})
        .catch((err) => {})
    },
    iconStyle(inx) {
      return { padding: 14 + 'rpx', background: '#007aff', borderRadius: '10rpx', color: '#EEEEEE' }
    },
    scrolltolower(e) {
      log('scrolltolower', e)
    },
  },
}
</script>

<style lang="scss">
.grid-text {
  font-size: 22upx;
  color: #777777;
}
</style>
